<template>
  <div class="b-container">
    <div>B组件-{{ money }}</div>
    <div>车:{{ car }}</div>
    <div>饮料:{{ drink }}</div>
    <div>女朋友名字:{{ grilFriend }}</div>
    <button @click="$emit('sendDrink', drink)">把饮料给父亲</button>
    <button @click="tell">把女朋友名字告诉C组件</button>
  </div>
</template>

<script setup>
import { inject, ref } from 'vue'
import emitter from './eventBus.js'
defineProps(['money'])

const car = inject('car')
const drink = ref('冰红茶')
const grilFriend = ref('丽丽')

const tell = () => {
  // B组件发送 emit
  emitter.emit('getGirlFriend',grilFriend)
}

</script>

<style>
.b-container {
  border: 5px solid #396a5f;
  padding: 3px;
  width: 300px;
  height: 300px;
  margin: 10px auto;
}
</style>